﻿body {margin: 0;padding: 0;background: #fff url(images/fontend/bg_body.png);
      /*font-family: Arial, Verdana, sans-serif;
      font-size: 13px;
      color: #404040;*/ /*#181B20;*/
      
    font-family: Helvetica,Arial,sans-serif;
    color: rgb(20,20,20);
    text-align: justify;
      }

h1, h2, h3 {margin: 0;padding: 0;font-family: 'Arial', serif;font-weight: normal;color: #ff8800;/*#ff9900;/*2E9F13;*/}
h1 {font-size: 2em;}
h2 {font-size: 2.4em;}
h3 {font-size: 1.6em;}

p, ul, ol {margin-top: 0;line-height: 20px;/*180%;*/}

a {text-decoration: none;color: #404040;}
a:hover {text-decoration: none; color:#090;/*03d403;*/}

img.border {border: 6px solid #EEE;/*7DF;*/}
img.alignleft {float: left;margin-right: 25px;}
img.alignright {float: right;}
img.aligncenter {margin: 0px auto;}

#wrapper {margin: 0 auto;padding: 0;}

/* Header */
#header-wrapper {height: 110px;}/*240px*/
#header {width: 1040px;height: 100%;/*240px*/margin: 0 auto;}
/* Header logo long ads banner*/
.logoads
    {
        width:1040px;
        }
        .logoads img
        {
            border:0;
            }
    .logo
    {
        float:left;
        text-align:center;        
        }
        .logo a
        {
            text-decoration:none;
            }
        .slogan
        {
            color:#090;
            font-size:14px;
            z-index:10;
            display:block;
            margin-top:-10px;
            }
    .adsheader
    {
        float:right;
        }


/* Page */
#page {
	width: 1040px; /*980px*/
	margin: 0 auto;padding: 10px 0 0 0; 
	background: #fff;/*background:url(images/fontend/bg_bg-site.png) repeat;*/
	border-left: 1px solid #FF9900; border-right: 1px solid #FF9900; border-bottom: 5px solid #FF9900;
        /*-moz-border-radius: 8px 8px 0 0;border-radius: 8px 8px 0 0;*/}
#page-bgtop {}
#page-bgbtm 
{
    /*margin:-5px 0 0 0;
    padding: 0 20px 0px 20px;*/
    
    margin: 0 20px 0px 20px;
}
    
#page-bgbtm .search {display:block; color:#03d403; background:url('images/fontend/icon-search.png') no-repeat; height:38px; line-height:21px; padding:10px 20px 0 60px; margin:5px 0 0 0px; border:0; font-size: 18px; font-weight: bolder;}
#page-bgbtm .article 
{
    display:block; color:#03d403; 
    background:url('images/fontend/icon-book.png') no-repeat; 
    height:38px; line-height:21px; padding:10px 20px 0 60px; 
    margin:-10px 0 0 0px; border:0; 
    font-size: 18px; font-weight: bolder;}
#page-bgbtm .article a{color:#03d403; text-decoration:none;}
#page-bgbtm .article a:hover{color:#03d403; text-decoration:none; text-shadow:1px 2px 10px #fc0;}
#page-bgbtm .article span{font-family:Georgia, Serif; color:#888; text-shadow:none; padding: 0 5px;}

/* Content */
#content {float: left;width: 680px;/*600px;*/margin-top:8px;
          
          }
          


.post {clear: both;padding-bottom: 0px;/*10px;*/}
.post .title {padding-top: 0px;/*10px;*/ letter-spacing: -2px;}
.post .title a {color: #FFB105;border: none;}
.post .meta {padding-bottom: 5px; /*10px;*/text-align: left;font-family: Arial, Helvetica, sans-serif;font-size: 11px;font-style: italic;}
.post .meta a {}
.post .entry {text-align: justify;margin-bottom: 5px; /*15px;*/padding: 0; /*10px 0px 0px 0px;*/}

.links {display: block;width: 96px;padding: 2px 0px 2px 0px;background: #A53602;text-align: center;text-transform: uppercase;font-size: 10px;color: #FFFFFF;}

/* Logon Frontend */

.logreg{text-align: center; border: 1px solid #ccc;margin-bottom: 10px;}
#logincomplete{text-align:left;}
#logincomplete img
{
    width:100px; 
    height:100px; 
    border-radius:0px; 
    margin:0 0 -3px 0; 
    border-right:1px solid #ccc; 
    padding:1.5px 1.5px 1.5px 1.5px;
}
#logincomplete .member{text-align: center;padding: 0 5px;}
#logincomplete .log_user{display:inline;}
#logincomplete .warning
{
    float:left; 
    background:url(../../../Content/images/fontend/icon-warning.png) no-repeat center;
    width: 49px;
    height: 50px;
    margin: 10px 0 -11px 4px;
}
#logincomplete .message
{
    float:left; 
    background:url(../../../Content/images/fontend/icon-message.png) no-repeat center;
    width: 49px;
    height: 50px;
    margin: 10px 6px -13px 6px;
}
#logincomplete .mark
{
    float:left; 
    background:url(../../../Content/images/fontend/icon-mark.png) no-repeat center;
    width: 49px;
    height: 50px;
    margin: 10px 0 -11px 0px;
}
#logincomplete .log_user span
{
    background: url(../../../Content/images/fontend/icon-point-red.png) no-repeat center;
    width: 20px;
    height: 21px;
    display: block;
    margin: -10px 0 0 30px;
    padding: 3px 0 0 0px;
    text-align: center;
    color: white;
    font-size: 9px;
} 


/* Sidebar */
#sidebar 
{
    float: left;
    width: 300px;/*240px*/
    margin: 14px 0 0 20px;
}
#sidebar ul {margin: 0;padding: 0;list-style: none;}
#sidebar li {margin: 0;padding: 0;}
#sidebar li ul {margin: 0px 0px;padding-bottom: 5px;/*30px;*/}
#sidebar li li {padding-left: 22px;/*30*/line-height: 22px;/*35*/background: url(images/fontend/bg_item.gif) no-repeat left 3px;}
#sidebar li li span {display: block;margin-top: -20px;padding: 0;font-size: 11px;font-style: italic;}
#sidebar h2 {height: 23px;/*38px;*/
             margin-bottom: 5px;/*20px;*/
             padding: 12px 0 0 0px; border-bottom: 1px solid #B6BFD0;
             text-transform: uppercase;letter-spacing: -1px;
             font-size: 20px;color: #ff8800;/*#FFB105;*/}

#sidebar p {margin: 0 0px;padding: 0px 20px 15px 20px;/*0px 20px 20px 20px;*/text-align: justify;}
#sidebar a {font-size: 15px !important;}
#sidebar div p {padding: 0 0 0 0; line-height: 16px; margin-top: 5px;}


/* sidebar Frontend layout StoryFunny.cshtml */
.Image100x65{max-width:100px; height:80px; margin-right: 4px;border: 3px solid #EEE;}
.h1Spec{color:#404040; font-size:1em; font-weight: 600; line-height: 16px;}
.pSpec{padding: 0 0 0 0; line-height: 16px; margin-top: 5px;}



/* Footer */
#footer {width: 1040px;/*960px;*/height: 55px;margin: 0 auto 40px auto;
	/*border-top: 3px solid #FF9F04;/*#B6BFD0;*/
	font-family: Arial, Helvetica, sans-serif;}
#footer p {margin: 0;padding-top: 18px;line-height: normal;text-align: center;color: #576475;}
#footer a {color: #576475;}

/* Logo*/
#logo {width: 1040px;margin: 0px;padding:10px 0px 0px 0px;color: #FFFFFF;float:left;}


/*
Article Details Layout
*/

div#Guest_Comment div
{
    margin-top: 6px;
}

div#Guest_Comment div#Guest_Name div, div#Guest_Comment div#Guest_Email div
{
   display: inline-block;
   min-width: 60px;
   margin-right: 3px;
}

div#Guest_Comment  label
{
    font: 700 14px arial;
    color: #FF9F04;
}

div#Guest_Comment  p#mesCommentContent, div#Member_Comment  p#mesCommentContent
{
    margin: 8px 0px 0px 228px;
}

div#Guest_Comment  p#Comment_Submit
{
    margin-top: 10px;
}


/* Notice and Alert*/

.alert_frontend
{
    font: 700 12px arial;
    color: Red;
}



/* Frontend ArticleList.cshtml */
        .articles,.specical{margin: 7px 0px 10px 0;padding: 0px;display:table;border-bottom:1px solid #ccc; width:680px;}
        .articles a:hover, .specical a:hover{ text-decoration:underline;}
        .articles:hover{background-color: rgb(248, 248, 248);}
        
        .articles img{  max-width: 205px; /*height: 128px;*/float: left; border: 6px solid #EEE;/*7DF;*/ margin-right:10px;}
        .specical img{  max-width: 680px; /*height:417px;*/ border: 6px solid #EEE;/*7DF;*/ margin:7px 0 0;}
     
        .articles h1,.specical h1{ margin:5px 0; font-weight: bold;font-size: 18px;color: #090;}
        .articles h2,.specical h2{margin-top:5px;font-size: 12px;font-style:italic;}
        .articles p{margin-top:5px;display:block; text-align:justify;color:#404040; padding:0 5px 0 0;}
      
        .specical:hover{background-color: rgb(248, 248, 248)/*#EEE*/; margin:7px 0px 10px 0;}
        .info{display:inline-block; color:#339933; font-style:italic; font-size: 12px;}
        .info a{color:#f90; text-decoration:none;}
        .info a:hover{color:#f90; text-decoration:underline;}
        /* description for specical*/
        .description{color:#f9f8f8; margin: -73px 0 0 0; 
                     padding: 10px 10px 10px 20px; 
                     background: url(../../../Content/images/fontend/bg_img-Article.png);
                     z-index: 10;position: relative;}
        .specical p{margin-top:5px;display:block; text-align:justify;color:#404040; padding:0 5px 0 0;}
                     
        .articles .postnews,.specical .postnews
        {
            color:#339933; background:url(../../../Content/images/fontend/icon_post.png) no-repeat left center; 
            padding:3px 3px 3px 20px;
        }
        .articles .view,.specical .view 
        {
            margin:0 10px; color:#cccc33; 
            background:url(../../../Content/images/fontend/icon_view.png) no-repeat left center; 
            padding:3px 3px 3px 18px;
        }
        .articles .comment,.specical .comment 
        {
            color:#66ccff; 
            background:url(../../../Content/images/fontend/icon_comment.png) no-repeat left center; 
            padding:3px 3px 3px 20px;
        }
        .articles .like,.specical .like
        {
            color:#f90; background:url(../../../Content/images/fontend/icon-like-orangeheart.png) no-repeat left center; 
            padding:3px 3px 3px 22px;
        }
        
/* Frontend Right side articles */       
        .rightside_articles{margin: 4px 0px 10px 0;padding: 0px;display:table;
                            border-bottom:1px solid #ccc;margin-bottom: 0px;
                            width: 100%;}
        .rightside_articles img{  max-width: 100px; /*height: 128px;*/float: left; border: 3px solid #EEE;/*7DF;*/ }
        
        .info_rightside_articles{color:#339933; font-weight: bold;text-align: justify;line-height: 17px;}
        .info2_rightside_articles{display:block; color:#339933; font-size: 14px;}
/* Frontend ArticleDetail.cshtml */
 
            .articlescontent{margin-top:6px;
                              font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif;
                               font: 15px/1.231 arial,helvetica,clean,sans-serif;
                               color: rgb(20,20,20);
                               line-height: 22px;
                             }
            .articlescontent .table
            {
                width:100%; padding:3px 0 3px 0; 
                border-bottom: 1px solid #B6BFD0;
                border-top: 1px solid #B6BFD0;
                margin: 10px 0 10px 0;
                display:table;}
            .articlescontent h2{margin-bottom: 5px; padding:0; letter-spacing: -1px; 
                                font-size: 22px; color: #ff8800;}
            .articlescontent a{color:#0000ff;text-decoration:none;}
            .articlescontent a:hover{color:#f90; text-decoration:underline;}
            .articlescontent p{ margin:5px 0 0 0;padding:10px 0 0 0;text-align: justify;
                               font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif;
                               font: 15px/1.231 arial,helvetica,clean,sans-serif;
                               color: rgb(20,20,20);
                               line-height: 22px;
                                }
            .articlescontent .postnews{float:left; color:#339933; 
                                       background:url(../../../Content/images/fontend/icon_post.png) no-repeat left center; padding:3px 3px 3px 19px;}
            .articlescontent .view{margin:0 15px; float:left; color:#cccc33; 
                                   background:url(../../../Content/images/fontend/icon_view.png) no-repeat left center; padding:3px 3px 3px 19px;}
            .articlescontent .like{float: left; color:#f90; background:url(../../../Content/images/fontend/icon-like-orangeheart.png) no-repeat left center; padding:3px 3px 3px 22px;}
            .articlescontent .like a{text-decoration:none;}
            .articlescontent .like a:hover{text-decoration:underline;}
            
            .articlescontent .adminedit
                             {margin:0 0 0 10px; float:right; color:#cccc33; 
                              padding:3px 3px 3px 3px;}
            
            .articlescontent .comment{color:#66ccff; background:url(../../../Content/images/fontend/icon_comment.png) no-repeat left center; 
                                      padding:3px 3px 3px 20px;}
            .articlemore{border-bottom:1px solid #ccc; margin:10px 0px 7px 0px;}
            .articlemore h2, .articlemore h2 a{font-size:16px; color:#ff8800;}
            .articlemore h2 a:hover{text-decoration:underline;}
            .commentarea{border-bottom:1px solid #ccc; margin:0px 0px 7px 42px; width:675px;}
            
            .formcomment{width:675px; margin:0 0 5px 0;}
			.formcomment textarea{width:675px;}
            
            .link-more{line-height:20px;}
            .link-more:hover{background:whitesmoke;}
            .link-more span{font-size:12px; color:#ccc; font-style:italic;}
            
            .link-more a{background:url(../../../Content/images/fontend/icon-bullet-grey.png) no-repeat left; padding:0 0 0 14px; 
                         color:#404040; text-decoration:none;}
            .link-more a:hover{background:url(../../../Content/images/fontend/icon-bullet-green.png) no-repeat left; padding:0 0 0 14px; 
                               color:#090; text-decoration:none;}
            .tags{border:1px solid #ccc; padding:7px 5px 7px 3px; margin-top:5px; }
                 /* background:url(../../../Content/images/fontend/icon-tags-orange.png) left no-repeat;}*/
            .tags span{color:#090; display:inline;}
            .tags a{color:#666; text-decoration:none; padding-left:15px;}
            .tags a:hover{color:#090; text-decoration:underline; padding-left:15px;}
            
            .button {border:1px solid #ccc; background:#090; color:#fff; border-radius:4px; padding:2px 6px 2px; margin-top:5px;}
            .button:hover {border:1px solid #f90; background:#090; color:#fff; border-radius:4px; padding:2px 6px 2p; margin-top:5px;}
            
            
            .share{border:1px solid #ccc; padding:5px 3px 3px 3px; margin-top:15px; }
            /* Other article-Tin khác */
            .othernews_label
            {
                border-bottom:1px solid #ccc; padding:7px 5px 0px 0px;
                margin: 5px 0px 0px 0px;
            }
            .othernews_label span{display:inline;font-size: 20px; color: #ff8800;}
            .othernews
            { 
               /*border :1px solid #ccc; */
              /* border-bottom:1px solid #ccc; */
               display :inline-block;
               width:675px;
               margin: 10px 0 0 0px;
               padding-left: 15px;
            }
            .othernews .othernews_onearticle{float: left;width:205px; margin-right: 10px;padding: 0 10px 10px 0;}
            .othernews .othernews_onearticle h2
            {
                color: #090;font-size: 13px;font-weight:bold; 
                margin-right: -10px;
                text-align: left;
            }
            .othernews_onearticle a:hover
            {
                text-decoration:underline;
            }
            .othernews .othernews_onearticle .img200x150{ width:205px; max-height:300px; margin:5px auto; border: 3px solid #EEE;}/*height:128px;*/
            /*End Other article-Tin khác  color: #F90;*/
            
            /*html, body { height: 100%; overflow: hidden; width: 100%; margin: 0; padding: 0; }
			body { overflow-y: auto; }*/
			.guestmember .lightbox { left: -999em; position: absolute; z-index:2000;}
			.guestmember .lightbox { left: -999em; position: absolute; }
			.guestmember .lightbox:target { bottom: 0; left: 0; right: 0; top: 0; position: absolute; }
			.guestmember .lightbox:target .close a { background: rgba(0, 0, 0, 0.75); bottom: 0; left: 0; right: 0; top: 0; position: absolute; z-index: 1; }
			.guestmember .close span { color: #FFFFFF; font-size: 2em; text-indent: 0; position: absolute; right: 0.5em; top: 0.5em; }
			.guestmember .close {text-indent: -999em;}
			.guestmember .lightbox:target div { background: #FFFFFF; position: absolute; left: 50%; top: 50%; z-index: 99; }
			.guestmember .w60p { margin-left: -30%; width: 60%; } .w300 { margin-left: -150px; width: 300px; } .w640 { margin-left: -320px; width: 640px; }
			.guestmember .h60 { height: 60px; margin-top: -30px; } .h400 { height: 400px; margin-top: -200px; } .h386 { height: 386px; margin-top: -193px; }
			.guestmember .scroll { overflow-y: scroll; padding: 0 1em; }
			.guestmember .boxfocus { bottom: 0; left: 0; right: 0; top: 0; position: absolute; }
			.guestmember .boxfocus div {	background: #FFFFFF; position: absolute; left: 50%; top: 50%; z-index: 99; }
			.guestmember .boxfocus .close a { background-image: url('trans.png'); bottom: 0; left: 0; right: 0; top: 0; position: absolute; z-index: 1; }
   
   
   /*  FrontEnd Homepage*/
   
   div#ShowMoreLink
   {
       width: 120px;
       float:left;
       margin: 0 0 0 283px;
   }
   
   div#ShowMoreLoading
   {
       display: none;
       width: 22%;margin: 0px auto;
       margin-bottom: 5px;
   }
   
   /*  FrontEnd Homepage Slide news */
   
    .tabs {
      position: relative;
      min-height: 290px; 
      clear: both;
      margin:12px 0 20px 0;
    }
    .tab {
      float: left;
    }
    .tab label {
      background: #eee; 
      padding: 5px 5px 2px 5px;
      border: 1px solid #ccc; 
      margin-left: -1px; 
      position: relative;
      left: 1px; 
      font-size: 14px;
    }
    .tab [type=radio] {
      display: none;   
    }
    .content {
      position: absolute;
      top: 20px;
      left: 0;
      background: white;
      right: 0;
      bottom: 0;
      padding: 10px;
      border: 1px solid #ccc; 
    }
    [type=radio]:checked ~ label {
      background: white;
      border-bottom: 1px solid white;
      z-index: 2;
    }
    [type=radio]:checked ~ label ~ .content {
      z-index: 1;
    }
    
     /*  FrontEnd Homepage 9 latest news */
    
    .blocks{width: 686px; display:inline-block; background:#fff;}
    .articlesnew{float: left;width: 205px; margin-right: 13.5px;padding: 0 10px 15px 0;}
    .articlesnew:hover{/*background: #eee/*url(../../../Content/images/fontend/bg_img-Article.png);*/}
    .articlesnew img{max-width: 205px;border: 5px solid #EEE;}/*height: 128px;*/
    .articlesnew h2{color: #090;font-size: 16px;font-weight:bold; padding: 3px 0 1px 0;margin-right: -10px;text-align: left;}
    .articlesnew content{color:#404040; display: block;text-align: justify;line-height: 20px; margin-right: -10px;}
    .articlesnew span{font-size: 12px;font-style: italic;color: #393;line-height: 18px;}
    .articlesnew span a{color:#f90; text-decoration:none;}
    .articlesnew a:hover{text-decoration:underline;}
    .articledetails{float: right;padding: 3px 10px 2px 15px;background: url(../../../Content/images/fontend/bg_item_next.gif) no-repeat right 9px;}
